<!-- DOCTYPE 我们用的规范-->
<!DOCTYPE html>
<html lang="en">

<!--网页头部-->
<head>
    <!--描述性标签 描述网站的信息-->
    <!--用来做SEO-->
    <meta charset="UTF-8">
    <meta name="keywords" content="写着玩">
    <meta name="description" content="学html的">
    <!--标题-->
    <title>基本标签</title>
</head>
<!--网页的主体-->
<body>

<h1>一级标签</h1>
<h2>二级标签</h2>
<h3>三级标签</h3>
<h4>四级标签</h4>
<h5>五级标签</h5>
<h6>六级标签</h6>
<p>分段用的</p>
<p>像这样</p>
<input type="range" max="1000" min="-10" value="500">
<hr>

换行<br/>
比段落间隔小<br/>

<p><strong>粗体： I love you</strong></p>
<p><em>斜体： I love you</em></p>
<!---->
<hr>
<!--特殊符号-->
空&nbsp;格<br>
&lt;大于<br>
&gt;小于
<p>&uarr;记得加分号</p>
<hr>
<p>插入图片！jpg gif pen bmp</p>
<!--
src:相对路径 绝对路径 alt 没有图片的时候显示的文字 title 鼠标悬停显示的东西
-->
<img src="../resource/image/1.jpg" alt="找不到图了呀" title="随便找的图" width="320" height="320">
<hr>
<p>超链接:</p>
<!--
连接标签 href
target 窗口打开位置 _blank 新标签里打开 默认_self
-->
<a href="https://www.baidu.com">跳转到百度</a>
<a href="http://dblab.xmu.edu.cn/" target="_blank">
    <img src="../resource/image/2.jpg" title="实验室网站">
</a>

<!--
锚连接
1.需要一个标记
2.跳转到标签
<a name="top"></a>
注意top是随便写的一个单词 随便换
<a href="#top">回上面去</a>
<a href="http://www.baidu.com#top">回百度上边去</a>
-->
<a name="top"></a>
<p><img src="../resource/image/3.jpg" title="实验室网站"></p>
<p><img src="../resource/image/3.jpg" title="实验室网站"></p>
<a href="#top">回上面去</a>
<a href="http://www.baidu.com#top">回百度上边去</a>

<!--
功能性链接
邮件：mailto
QQ链接：去qq推广里复制
块元素：换行 如 <p> 行内元素：不换行 <strong>
-->
<a href="mailto:1055475321@qq.com">邮件</a>
<a target="_blank" href="http://wpa.qq.com/msgrd?v=3&uin=1055475321&site=qq&menu=yes"><img border="0"
                                                                                           src="http://wpa.qq.com/pa?p=2:1055475321:52"
                                                                                           alt="给我发消息"
                                                                                           title="给我发消息"/></a>
<!--
列表：
无序列表<ul>
有序列表<ol>
自定义列表
<dl>标签
<dt>列表名称
<dd>列表内容
-->
<ol>
    <li>JAVA</li>
    <li>Pyhon</li>
    <li>C</li>
    <li>Html</li>
</ol>
<hr>
<ul>
    <li>JAVA</li>
    <li>Pyhon</li>
    <li>C</li>
    <li>Html</li>
</ul>
<hr>
<dl>
    <dt>位置</dt>
    <dd>山东</dd>
    <dd>新疆</dd>
    <dd>湖北</dd>
    <dd>厦门</dd>
    <dd>浙江</dd>
</dl>
<!--
表格：
<table>
<table border>边界设置
<tr>行
<td>列
<td colspan> 跨列
<td rowspan> 跨列
-->
<table border="1px">
    <tr>
        <td colspan="5">10</td>
    </tr>
    <tr>
        <td rowspan="3">11</td>
        <td>12</td>
        <td>13</td>
        <td>14</td>
        <td>15</td>
    </tr>
    <tr>
        <td>21</td>
        <td>22</td>
        <td>23</td>
        <td>24</td>
    </tr>
    <tr>
        <td>31</td>
        <td>32</td>
        <td>33</td>
        <td>34</td>
    </tr>
</table>

<!--
视频音频
<video>
<audio>
controls 控制条 autoplay 自动播放
-->
<video src="../resource/video/SampleVideo_1280x720_2mb.mp4" controls></video>
<audio src="../resource/audio/d5897bb189b0cc3e00f2f7dcc0c56239.m4a" controls></audio>

</body>
</html>